<template>
	<view class="uni-common-mt">
		<view class="" style="width: 100%;">
			<view style=" margin: 0 auto;">
				<p style="font-size: 28px; text-align: center;">{{post.title}}</p>
			</view>

		</view>
		<view class="">
			<p>作者：{{author}}</p><p>时间：{{post.date}}</p>
		</view>
		<view class="" style="word-break: break-all;">
			<text>{{post.content}}</text>
		</view>
		
		<view class="uni-form-item uni-column" style="width: 80%; margin:5% auto 0 auto;">
			<view class="title">评论：</view>
			<view class="uni-textarea" style="border: 1px solid black;">
			<textarea  placeholder="输入内容" v-model="comment"/>
			</view>
		</view>
		<view class="a">
			<button @tap="postComment">发布评论</button>
		</view>
<uni-list style="margin-top: 4%;">
	<uni-list :border="true">

		<uni-list-item  v-for="(item, index) in post.comments" :key="index" :title="item.user_info.nick_name" :note="item.comment" :rightText="item.date" ></uni-list-item>


	</uni-list>
</uni-list>



		<popview4 ref="popview4"></popview4>
		<loading
			ref="loading"
			:custom="false"
			:shadeClick="true"
			:type="1"
			>
			<view style="text-align: center;">等待中</view>
		</loading>
	</view>
</template>

<script>
	import popview4 from '@/components/pop-view/pop-view4.vue'
	import loading from '@/components/xuan-loading/xuan-loading.vue'
	export default {
		components: {
			popview4,
			loading
		},
		async onLoad(option){
			let item = JSON.parse(decodeURIComponent(option.item));
			let value = await uni.getStorageSync('user_info');
			this.user_info=value
			this.author=item.user_info.nick_name
			let a = await this.getPostByPostIdB(item._id)
		},
		data() {
			return {
				post:{},
				nick_name:"",
				author:"",
				list:[
					{
						"title":"评论1",
						"content":"无",
						"date":"2020-02-02 20:20",
						"author":"eweew"
					},
					{
						"title":"评论2",
						"content":"无",
						"date":"2020-02-02 20:20",
						"author":"eweew"
					},
					{
						"title":"评论3",
						"content":"无",
						"date":"2020-02-02 20:20",
						"author":"eweew"
					}
				],
				comment:"",
				user_info:{}
			}
		},
		methods: {
			postComment(){
				if(this.comment==0){
					this.$refs['popview4'].error('请输入评论');
				}else{
					this.$refs.loading.open();
					let comment_info={
						"comment":this.comment,
						"user_info":this.user_info,
						"date":this.getTime()
					}
					uniCloud.callFunction({
					    name: 'postComment',
					    data: {
							"post_id":this.post._id,
							"comment_info":comment_info
						}
					  })
					  .then(res => {
						let result=res.result
						// this.$refs.loading.close();
						console.log(result)
						//this.$refs['popview4'].success('评论成功');
						this.getPostByPostId(this.post._id)
					  });
				}				
			},
			getPostByPostId(id){
				uniCloud.callFunction({
					name: 'getPostById',
					data: {
							"post_id":id,
					}
				})
				.then(res => {
					let result=res.result
						// this.$refs.loading.close();
					this.post=result.post
					this.$refs.loading.close();
					this.$refs['popview4'].success('评论成功');
					this.comment=""
				});
			
			},
			getPostByPostIdB(id){
				uniCloud.callFunction({
					name: 'getPostById',
					data: {
							"post_id":id,
					}
				})
				.then(res => {
					let result=res.result
						// this.$refs.loading.close();
					this.post=result.post
					console.log(this.post)
				});
			
			},
			getTime(){
				var date = new Date(),
				year = date.getFullYear(),
				month = date.getMonth() + 1,
				day = date.getDate(),
				hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(),
				minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes(),
				second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
				month >= 1 && month <= 9 ? (month = "0" + month) : "";
				day >= 0 && day <= 9 ? (day = "0" + day) : "";
				var timer = year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second;
				return timer;
			}
		}
	}
</script>

<style scoped>
	.chat-custom-right {
		flex: 1;
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: column;
		justify-content: space-between;
		align-items: flex-end;
	}

	.chat-custom-text {
		font-size: 12px;
		color: #999;
	}
	.a{
		display: flex;
		margin-top: 5% auto 0 auto;
		width: 100%;
	}
</style>
